<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>管理后台</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="/static/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/css/index.css" media="all">
</head>
<body class="main_body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header header">
        <div class="layui-main mag0">
            <a href="#" class="logo">管理后台</a>
            <a href="javascript:;" class="seraph hideMenu icon-caidan"></a>
            <ul class="layui-nav mobileTopLevelMenus" mobile>
                <li class="layui-nav-item">
                    <a href="javascript:;"><i class="seraph icon-caidan"></i><cite>管理后台</cite></a>
                    <dl class="layui-nav-child">
                        <dd data-menu="member">
                            <a href="javascript:;"><i class="layui-icon" data-icon="&#xe770;">&#xe770;</i><cite>用户管理</cite></a>
                        </dd>
                        {if condition="session('type') == 1"}
                        <dd data-menu="content">
                            <a href="javascript:;"><i class="layui-icon" data-icon="&#xe60a;">&#xe60a;</i><cite>内容管理</cite></a>
                        </dd>
                        {/if}
                        <dd data-menu="order">
                            <a href="javascript:;"><i class="layui-icon" data-icon="&#xe63c;">&#xe63c;</i><cite>订单管理</cite></a>
                        </dd>
                        {if condition="session('type') == 1"}
                        <dd data-menu="system">
                            <a href="javascript:;"><i class="layui-icon" data-icon="&#xe620;">&#xe620;</i><cite>系统设置</cite></a>
                        </dd>
                        {/if}
                    </dl>
                </li>
            </ul>
            <ul class="layui-nav topLevelMenus" pc>
                <li class="layui-nav-item layui-this" data-menu="member" pc>
                    <a href="javascript:;"><i class="layui-icon" data-icon="&#xe770;">&#xe770;</i><cite>用户管理</cite></a>
                </li>
                {if condition="session('type') == 1"}
                <li class="layui-nav-item" data-menu="content" pc>
                    <a href="javascript:;"><i class="layui-icon" data-icon="&#xe60a;">&#xe60a;</i><cite>内容管理</cite></a>
                </li>
                {/if}
                <li class="layui-nav-item" data-menu="order" pc>
                    <a href="javascript:;"><i class="layui-icon" data-icon="&#xe63c;">&#xe63c;</i><cite>订单管理</cite></a>
                </li>
                {if condition="session('type') == 1"}
                <li class="layui-nav-item" data-menu="system" pc>
                    <a href="javascript:;"><i class="layui-icon" data-icon="&#xe620;">&#xe620;</i><cite>系统设置</cite></a>
                </li>
                {/if}
            </ul>
            <ul class="layui-nav top_menu">
                <li class="layui-nav-item" id="userInfo">
                    <a href="javascript:;"><img src="/static/images/logo.jpg" class="layui-nav-img userAvatar"
                                                width="35" height="35"><cite
                            class="adminName">{$Think.session.nickname}</cite></a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;" data-url="{:url('index/resetPassword')}"><i
                                class="seraph icon-xiugai" data-icon="icon-xiugai"></i><cite>修改密码</cite></a></dd>
                        <dd><a href="{:url('index/logout')}" class="signOut"><i
                                class="seraph icon-tuichu"></i><cite>退出</cite></a></dd>
                    </dl>
                </li>
            </ul>
        </div>
    </div>
    <div class="layui-side layui-bg-black">
        <div class="user-photo">
            <a class="img" title="我的头像"><img src="/static/images/logo.jpg" class="userAvatar"></a>
            <p>你好！<span class="userName">{$Think.session.nickname}</span>, 欢迎登录</p>
        </div>
        <div class="navBar layui-side-scroll" id="navBar">
            <ul class="layui-nav layui-nav-tree">
            </ul>
        </div>
    </div>
    <div class="layui-body layui-form">
        <div class="layui-tab mag0" lay-filter="bodyTab" id="top_tabs_box">
            <ul class="layui-tab-title top_tab" id="top_tabs">
                <li class="layui-this" lay-id=""><i class="layui-icon">&#xe68e;</i> <cite>后台首页</cite></li>
            </ul>
            <ul class="layui-nav closeBox">
                <li class="layui-nav-item">
                    <a href="javascript:;"><i class="layui-icon caozuo">&#xe643;</i> 页面操作</a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;" class="refresh refreshThis"><i class="layui-icon">&#x1002;</i>
                            刷新当前</a></dd>
                        <dd><a href="javascript:;" class="closePageOther"><i class="seraph icon-prohibit"></i> 关闭其他</a>
                        </dd>
                        <dd><a href="javascript:;" class="closePageAll"><i class="seraph icon-guanbi"></i> 关闭全部</a></dd>
                    </dl>
                </li>
            </ul>
            <div class="layui-tab-content clildFrame">
                <div class="layui-tab-item layui-show">
                    <iframe src="{:url('index/main')}"></iframe>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-footer footer">
        <p><span>copyright @2018 <a href="javascript:void(0);">沐芃科技</a></span></p>
    </div>
</div>
<div class="site-tree-mobile"><i class="layui-icon">&#xe602;</i></div>
<div class="site-mobile-shade"></div>
<script src="/static/layui.js"></script>
<script>
    var $, tab, dataStr, layer;
    layui.config({
        base: "/static/"
    }).extend({
        "bodyTab": "bodyTab"
    });
    layui.use(['bodyTab', 'form', 'element', 'layer', 'jquery'], function () {
        if (window.top != window.self) {
            window.top.location = '{:url("index/index")}';
        }

        var form = layui.form,
            element = layui.element;
        $ = layui.$;
        layer = layui.layer;
        tab = layui.bodyTab({
            openTabNum: "50",  //最大可打开窗口数量
            url: "{:url('navs')}" //获取菜单json地址
        });

        function getData(json) {
            $.getJSON(tab.tabConfig.url + '?active=' + json, function (data) {
                dataStr = data;
                tab.render();
            })
        }

        //通过顶部菜单获取左侧菜单
        $(".topLevelMenus li,.mobileTopLevelMenus dd").click(function () {
            if ($(this).parents(".mobileTopLevelMenus").length != "0") {
                $(".topLevelMenus li").eq($(this).index()).addClass("layui-this").siblings().removeClass("layui-this");
            } else {
                $(".mobileTopLevelMenus dd").eq($(this).index()).addClass("layui-this").siblings().removeClass("layui-this");
            }
            $(".layui-layout-admin").removeClass("showMenu");
            $("body").addClass("site-mobile");
            getData($(this).data("menu"));
            //渲染顶部窗口
            tab.tabMove();
        });
        if ($('.mobileTopLevelMenus').is(':hidden')) {
            $(".topLevelMenus li").eq(0).trigger('click');
        } else {
            $(".mobileTopLevelMenus dd").eq(0).trigger('click');
        }
        //隐藏左侧导航
        $(".hideMenu").click(function () {
            if ($(".topLevelMenus li.layui-this a").data("url")) {
                layer.msg("此栏目状态下左侧菜单不可展开");  //主要为了避免左侧显示的内容与顶部菜单不匹配
                return false;
            }
            $(".layui-layout-admin").toggleClass("showMenu");
            //渲染顶部窗口
            tab.tabMove();
        });
        //手机设备的简单适配
        $('.site-tree-mobile').on('click', function () {
            $('body').addClass('site-mobile');
        });
        $('.site-mobile-shade').on('click', function () {
            $('body').removeClass('site-mobile');
        });

        // 添加新窗口
        $("body").on("click", ".layui-nav .layui-nav-item a:not('.mobileTopLevelMenus .layui-nav-item a')", function () {
            //如果不存在子级
            if ($(this).siblings().length == 0) {
                addTab($(this));
                $('body').removeClass('site-mobile');  //移动端点击菜单关闭菜单层
            }
            $(this).parent("li").siblings().removeClass("layui-nav-itemed");
        })
    });

    //打开新窗口
    function addTab(_this) {
        tab.tabAdd(_this);
    }
</script>
</body>
</html>